<template>
	<view class="content">

		<view class="login-bg">
            <view style="color: #fff;font-size: 15px;text-align: center;">{{type == 'login'?'登录':'注册'}}</view>
			<view class="login-card">
				<view class="uni-media-image">
					<!-- <image src="/static/xinxun.png" class="logo" mode="heightFix" /> -->
				</view>

				<view class="login-head">&nbsp;&nbsp;</view>
                <view style="font-size: 45rpx;text-align: center;color: #44bcf5; font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif">
                    <!-- SK海力士 -->
                    欢迎来到中连
                    <!-- <view style="margin-left: 120rpx;margin-top: 10rpx;font-size: 45rpx;">相约信讯</view> -->
                </view>
				<view v-if="type=='login'" style="margin-top: 50rpx;">
                    <view style="border-radius: 50rpx; box-shadow: 0 0 3rpx 3rpx #2a547a;padding:  5rpx 25rpx ;">
                        <view style="display: flex; align-items: center;">
                            <image src="../../static/zh.png" class="icons" style="width: 20px;height: 20px;"></image>
                            <input type="text" class="uni-input" placeholder="请输入手机号" v-model="form.username" />
                        </view>
                    </view>
                    <view style="margin-top: 50rpx; border-radius: 50rpx; box-shadow: 0 0 3rpx 3rpx #2a547a;padding:  5rpx 25rpx ;">
                        <view style="display: flex; align-items: center;position: relative;min-height: 80rpx;">
                            <image src="../../static/password.png" class="icons" style="width: 20px;height: 20px;"></image>
                            <uni-easyinput type="password" v-model="form.password" placeholder="请输入密码"></uni-easyinput>
                           
                        </view>
                    </view>
                    <view style="margin-top: 50rpx; border-radius: 50rpx; box-shadow: 0 0 3rpx 3rpx #2a547a;padding:  5rpx 25rpx ;">
                        <view style="display: flex; align-items: center; position: relative;">
                            <image src="../../static/img/yan.png" class="icons" style="width: 20px;height: 20px;"></image>
                            <input class="uni-input" placeholder="请输入验证码" 
                            	v-model="form.captch" />
                            <image :src="codeurl" class="captchimg" @tap="changecode()"></image>
                        </view>
                    </view>
					
				<!-- 	<view class="line" style="display: none;">
						<checkbox id="save" :checked="form.save" value="1">记住登录状态</checkbox>
					</view> -->
				</view>


				<view v-if="type=='reg'" style="margin-top: 50rpx;">
                    <view style="border-radius: 50rpx; box-shadow: 0 0 3rpx 3rpx #2a547a;padding:  5rpx 25rpx ;">
                        <view style="display: flex; align-items: center;">
                            <image src="../../static/zh.png" class="icons" style="width: 20px;height: 20px;"></image>
                            <input @blur="check_name($event.detail.value)" type="text" class="uni-input" placeholder="请输入手机号" v-model="form.username" />
                            
                        </view>
                    </view>
                    <view style="margin-top: 50rpx; border-radius: 50rpx; box-shadow: 0 0 3rpx 3rpx #2a547a;padding:  5rpx 25rpx ;">
                        <view style="display: flex; align-items: center;position: relative;min-height: 80rpx;">
                            <image src="../../static/password.png" class="icons" style="width: 20px;height: 20px;"></image>
                            <uni-easyinput @input="checkpwd($event.detail.value)" @blur="check_other($event.detail.value,'password')"  type="password" v-model="form.password" placeholder="请输入密码"></uni-easyinput>
                        </view>
                    </view>
                    <view class="passwordtips" v-if="passwordtips">
                    	密码强度：<view :class="passwordcolor">{{passwordtiphtml}}</view>
                    </view>
                    <view style="margin-top: 50rpx; border-radius: 50rpx; box-shadow: 0 0 3rpx 3rpx #2a547a;padding:  5rpx 25rpx ;">
                        <view style="display: flex; align-items: center;position: relative;min-height: 80rpx;">
                            <image src="../../static/password.png" class="icons" style="width: 20px;height: 20px;"></image>
                            <uni-easyinput @input="checkpwd($event.detail.value)"  @blur="check_other($event.detail.value,'password1')"  type="password" v-model="form.password2" placeholder="请输入密码"></uni-easyinput>
                        </view>
                    </view>
					<!-- <label class="uni-list-cell uni-list-cell-pd" v-if="system.inviteopen==1">
						<label class="label-2-text" style="width:100upx;">
							<image src="../../static/img/yao.png" class="icons" style="width: 20px;height: 20px;">
							</image>
						</label>
						<view>
							<input class="uni-input" maxlength="6" placeholder="请输入邀请码" v-model="form.randcode" />
							<view class="getcode" @tap="getcode" v-if="system.invite_code!=''">获取邀请码</view>
						</view>
					</label> -->
                    <view style="margin-top: 50rpx; border-radius: 50rpx; box-shadow: 0 0 3rpx 3rpx #2a547a;padding:  5rpx 25rpx ;">
                        <view style="display: flex; align-items: center; position: relative;">
                            <image src="../../static/img/yan.png" class="icons" style="width: 20px;height: 20px;"></image>
                            <input class="uni-input" placeholder="请输入验证码" 
                            	v-model="form.captch" @blur="check_other($event.detail.value,'randcode')"/>
                            <image :src="codeurl" class="captchimg" @tap="changecode()"></image>
                        </view>
                    </view>
				</view>
			</view>
			<view class="login-btn">

				<button v-if="type=='login'" class="landing_true" :disabled="checkIn ? false : true" type="primary"
					@tap="click_login">立即登录</button>
				<button v-else class="landing_true" :disabled="checkIn ? false : true" type="primary"
					@tap="click_reg">注册</button>
			</view>

			<view class="line1">
				<view style="color:#44d0ef;" v-if="type=='login'" @tap="changetype('reg')">没有账号？去注册 </view>
				<view style="color:#44d0ef;" v-if="type=='reg'" @tap="changetype('login')">已有账号？去登录 </view>
                <!-- <view @click="go_forget">忘记密码</view> -->

			</view>
		</view>
		<view style="justify-content: center; color: #fff; text-align: center;margin-top: 30px; display: flex;align-items: center; font-size: 10px;">
			<!-- <checkbox v-bind:checked="isread" @tap="isread=!isread" id="readrule" value="1"> -->
                {{type=='login'?'登录':'注册'}}即代表同意信讯</checkbox>《<view
				class="rule" @tap="go_rule(0)">用户协议</view>》及《<view class="rule" @tap="go_rule(1)">隐私条款</view>》


		</view>

		<view class="modalhtml" v-if="showModal">

			<view class="modal">
				<view class="title">
					个人信息保护指南
				</view>
				<view class="content">
					请充分阅读并理解<br> 《<view class="rule" @tap="go_rule(0)">用户协议</view>》及《<view class="rule"
						@tap="go_rule(1)">隐私条款</view>》<br>
					<view>
						1.在您使用本应用时，我们可能会申请系统设备权限收集设备信息、日志信息，用于推送和安全风控，并申请存储权限，用于下载及缓存相关文件<br>
						2.您使用发布视频、语音、图片等功能时候，我们会请求您授权相机、照片、麦克风的权限。您如果拒绝授权提供，将无法使用此功能，但不影响您使用本应用的其他功能。 <br>
						3.在您使用本应用网络服务，本应用自动接收并记录您的设备信息，包括但不限于您的IP地址、使用的语言、访问日期和时间、软硬件特征信息等数据；

					</view>
				</view>
				<view class="btns" @tap="readrule()">
					好的
				</view>
			</view>

		</view>
		<!-- #ifndef APP-PLUS -->
		<view class="downapp" v-if="showdown==true">
			<view @tap="showdown=false">
				<uni-icons type='close' color="#fff" style="font-size: 18px;font-weight: 700;"></uni-icons>

			</view>
			<view>下载APP，体验更多精彩</view>
			<view>
				<button @tap='downapp'>下载</button>

			</view>

		</view>
		<!-- #endif -->
	</view>
</template>

<script>
	import store from "../../store";
	import cache from '../../library/cache.js'
	import api from "../../library/index.js"
	import uniIcons from '../../components/uni-icons/uni-icons.vue'
	import config from "../../config.js";
	import http from '../../library/http.js'
	import headerline from '../../components/header.vue'
	var windowHeight = uni.getSystemInfoSync().windowHeight;
	var statusBarHeight = uni.getSystemInfoSync().statusBarHeight;
	export default {
		components: {
			uniIcons
		},
		data() {
			return {
				statusBarHeight: statusBarHeight + 'px',
				showPassword: true,
				type: 'login',
				getCodeTime: 60,
				issend: false,
				timer1: '',
				method: 'login',
				system: uni.getStorageSync('system'),
				codeurl: '',
				passwordcolor: 'color0',
				passwordtiphtml: '',
				passwordtips: false,
				usernamemsg: false,
				passwordmsg: false,
				passwordmsg2: false,
				captchmsg: false,
				name_status: false,
				code_status: false,
				checkIn: true,
				title: '登录',
				isread: true,
				form: {
					username: '',
					password: '',
					password2: '',
					mobile: '',
					captch: '',
					nickname: '',
					save: true,
					randcode: ''

				},
				showModal: false,
				showdown: true,
                isf:true,
                isf1:true,
                isf2:true,
			}
		},
		onLoad(opts) {
			if (opts.invite_code) {
				this.changetype('reg');
				this.form.randcode = opts.invite_code;
			}

			this.changecode();
			// #ifdef APP-PLUS
			this.$action.bindcid();
			if (!uni.getStorageSync('readrule'))
				this.showModal = true;
			// #endif
			this.$action.init();
		},
		onShow() {
			this.changecode();
			//  var currentWebview = page.$getAppWebview();
			if (uni.getStorageSync('access_token') > 0) {

				this.$jump('index.index');
			}

		},
		computed: {

		},
		methods: {
			downapp() {

				window.open(this.system.downurl);

			},
			getcode() {
				this.form.randcode = this.system.invite_code;
			},
			readrule() {
				uni.setStorageSync('readrule', 1);
				this.showModal = false;
			},
			changecode() {
				this.codeurl = config.imgUri + 'inc/checkcode.inc.php?rand=' + Math.random() + '&agentid=' + this
			.agentid();
			},
			changePassword() {
				this.showPassword = !this.showPassword;
			},
			delInputUsernameText() {
				this.form.username = ''
			},
			delInputPasswordText() {
				this.form.password = ''
			},
			delInputMobileText() {
				this.form.mobile = '';
			},
			delInputCaptchText() {
				this.form.captch = '';
			},
			agentid() {
				if (uni.getStorageSync('agentid')) return uni.getStorageSync('agentid');
				else {
					var agentid = this.randomstr(18);
					uni.setStorageSync('agentid', agentid);
					return agentid;
				}
			},
			randomstr(len) {
				var chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678';
				var maxPos = chars.length;
				var pwd = '';

				for (var i = 0; i < len; i++) {
					pwd += chars.charAt(Math.floor(Math.random() * maxPos));
				}
				return pwd;
			},
			changetype(type) {
				this.type = type;
                this.changecode()
			},

			login_success(res) {
				//  console.log(res);
				var resdata = res.data;
				var id = resdata.id;
				uni.setStorageSync('access_token', id);
				uni.setStorageSync('userid', id);
				uni.setStorageSync(id + '_groups', res.groups);
				uni.setStorageSync(id + '_frienddata', res.friends);
				uni.setStorageSync('shownote', true);

				this.$socket.send({
					type: 'otherlogin',
					uid: id
				});
				this.$socket.emit('no_auth');
				uni.setStorageSync('userInfo', resdata);
				//  this.$store.commit('update_userinfo', resdata);
				// console.log(res);
				//    api.getMyGroup({userid:id}).then(res => {
				//    	uni.setStorageSync(id+'_groups',res.data)
				//    })


				//    api.getMyFriend({userid:id}).then(resss => {
				//        uni.setStorageSync(id+'_frienddata',resss.data);
				//    })             
				var data11 = {
					token: id,
					type: 'setting'
				}
				this.$socket.send(data11);
				this.$action.bindcid();
				var urls = uni.getStorageSync('gourl');
				if (urls) {
					// console.log(urls);
					uni.reLaunch({
						url: urls
					})
				} else {
					uni.reLaunch({
						url: '../index/index'
					})
				}


			},

			click_login() {
				let _this = this;

				if (this.isread == false) {
					uni.showToast({
						icon: 'none',
						title: '请阅读《用户协议》及《隐私条款》',
						duration: 1000
					})
					return false;
				}
				if (_this.form.username == '') {
					uni.showToast({
						icon: 'none',
						title: '请输入登录账号',
						duration: 1000
					})
					return false;
				}

				if (this.form.password == '') {
					uni.showToast({
						icon: 'none',
						title: '请输入登录密码',
						duration: 1000
					})
					return false;
				}
                if(this.form.captch == ''){
                    uni.showToast({
                        icon: 'none',
                        title: '请输入验证码',
                        duration: 1000
                    })
                    return false;
                }
                if (this.form.captch.length != 4) {
                	uni.showToast({
                		icon: 'none',
                		title: '验证码长度不正确',
                		duration: 1000
                	})
                	return false;
                }
                
  
                
				var data = {
					username: _this.form.username,
					password: _this.form.password
				};

				this.checkIn = false;
				api.login(data).then(res => {
					this.checkIn = true;

					this.login_success(res);
				}).catch((err) => {
					console.log('登录', res)
				})
				var that = this;
				setTimeout(function() {
					that.checkIn = true;

				}, 2000)

			},

			check_name(value) {
				var reg = /^[\d\w]+$/;
				if (reg.test(value)) {
					if (value.length > 5) {

						http.setWait(false).post('user.php?act=checkname1', {
							username: value
						}).then(res => {

							var data = res.data;
							console.log('dfhdhdfhdhdh111', data)

							if (res.status == 200) {

								this.name_status = true;
								this.usernamemsg = 'ok';
							} else {

								this.usernamemsg = 'error';
								this.name_status = false;
								uni.showToast({
									icon: 'none',
									title: res.message,
									duration: 1000
								})
							}
						})


					} else {

						this.name_status = false;
						this.usernamemsg = 'error';

					}


				} else {
					this.usernamemsg = 'error';
					this.name_status = false;


				}
			},
			checkpwd(pwd) {

				var p1 = (pwd.search(/[a-zA-Z]/) != -1) ? 1 : 0;
				var p2 = (pwd.search(/[0-9]/) != -1) ? 1 : 0;
				var p3 = (pwd.search(/[A-Z]/) != -1) ? 1 : 0;
				var pa = p1 + p2 + p3;

				if (pa > 0) {

					var num = pa - 1;
					var arr = ['弱', '中', '强'];
					this.passwordtiphtml = arr[num];
					this.passwordcolor = 'color' + num;
					this.passwordtips = true;

				} else {
					this.passwordtips = false;
				}

			},
			check_other(value, name) {


				if (name == 'password') {
					if (value.length > 0) {
						if (value.length > 5) {
							this.passwordmsg = 'ok';

						} else {
							this.passwordmsg = 'error';
						}


					} else {
						this.passwordmsg = false;
					}
				}



				if (name == 'password1') {
					if (value.length > 0) {
						if (value == this.form.password) {
							this.passwordmsg2 = 'ok';

						} else {
							this.passwordmsg2 = 'error';
						}

					} else {
						this.passwordmsg2 = false;
					}

				}
				if (name == 'randcode') {

					if (value.length > 0) {

						if (value.length == 4) {
							http.setWait(false).post('user.php?act=checkcode1', {
								randcode: value
							}).then(res => {
								var data = res.data;
                                console.log('dsaaaaa',res.status)
								if (res.status == 200) {

									this.code_status = true;
									this.captchmsg = 'ok';
                                    console.log('dsaaaaa8888',res.status)
								} else {

									this.captchmsg = 'error';
									this.code_status = false;
									uni.showToast({
										icon: 'none',
										title: "验证码错误",
										duration: 1000
									})
								}
							})

						} else {
							this.code_status = false;
							this.captchmsg = 'error';
						}

					} else {

						this.code_status = false;
						this.captchmsg = false;

					}


				}


			},
			click_reg() {
				var _this = this;

				if (this.isread == false) {
					uni.showToast({
						icon: 'none',
						title: '请阅读《用户协议》及《隐私条款》',
						duration: 1000
					})
					return false;
				}

				if (_this.form.username == '') {
					uni.showToast({
						icon: 'none',
						title: '请输入手机号',
						duration: 1000
					})
					return false;
				}
				if (_this.form.username.length < 6) {
					uni.showToast({
						icon: 'none',
						title: '用户长度不能小于6位',
						duration: 1000
					})
					return false;
				}

				if (_this.form.password == '') {
					uni.showToast({
						icon: 'none',
						title: '请输入登录密码',
						duration: 1000
					})
					return false;
				}
				if (this.form.password.length < 6) {
					uni.showToast({
						icon: 'none',
						title: '密码长度不能小于6位',
						duration: 1000
					})
					return false;
				}

				if (this.form.password != this.form.password2) {
					uni.showToast({
						icon: 'none',
						title: '两次密码输入不一致',
						duration: 1000
					})
					return false;
				}
				if (this.system.inviteopen == 1 && this.form.randcode == '') {
					uni.showToast({
						icon: 'none',
						title: '请输入邀请码',
						duration: 1000
					})
					return false;
				}
				if (this.form.captch == '') {
					uni.showToast({
						icon: 'none',
						title: '请输入验证码',
						duration: 1000
					})
					return false;
				}
				if (this.form.captch.length != 4) {
					uni.showToast({
						icon: 'none',
						title: '验证码长度不正确',
						duration: 1000
					})
					return false;
				}
				if (this.name_status == false) {
					uni.showToast({
						icon: 'none',
						title: '该账号已被注册',
						duration: 1000
					})
					return false;
				}

				if (this.code_status == false) {
					uni.showToast({
						icon: 'none',
						title: '您输入的验证码不正确',
						duration: 1000
					})
					this.changecode();
					return false;
				}

				this.checkIn = false;
				api.register({
					username: this.form.username,
					password: this.form.password,
					randcode: this.form.captch,
					invite_code: this.form.randcode
				}).then(res => {
					this.checkIn = true;
					if (res.code == 200) {
						this.login_success(res);
						// var reg=res.data.reg;
						//  var that=this;
						//  var uid=id;
						//  setTimeout(function(){
						//      that.sendtips(reg,uid);
						//  },500)
					} else {
						this.changecode();
					}

				})
				var that = this;
				setTimeout(function() {
					that.checkIn = true;
					that.changecode();
				}, 2000)
			},
			sendtips(reg, uid) {
				if (reg.kefu && reg.kefu_tips) {
					let data = {
						userid: reg.kefu,
						friend_uid: uid,
						content: reg.kefu_tips,
						msgtype: 'text',
						type: 'chat'
					}

					this.$socket.send(data);
				}
				if (reg.admin && reg.admin_tips) {
					let data = {
						userid: reg.admin,
						friend_uid: uid,
						content: reg.admin_tips,
						msgtype: 'text',
						type: 'chat'
					}
					this.$socket.send(data);
				}

			},

			go_forget() {
				uni.navigateTo({
					url: 'froget'
				})
			},

			go_rule(type) {
				console.log(type)
				uni.navigateTo({
					url: 'rule?type=' + type
				})
			},
		}
	}
</script>

<style>
	@import '../../static/css/uni.css';
    page{
        background: url('../../static/bg.jpg');
        height: 100vh;
    }
	.rule {
		color: #44d0ef;
		display: inline-block;
        font-size: 10px;
	}

	.downapp {
		position: fixed;
		bottom: 0px;
		left: 0px;
		width: 100%;
		height: 40px;
		line-height: 40px;
		background-color: rgba(0, 0, 0, 0.6);
		color: #fff;
		font-size: 14px;
		;
		display: inline-block;
		width: 100%;

	}

	.downapp>view {
		display: inline-block;
		text-align: center;
	}

	.downapp>view:nth-child(1) {

		width: 40px;
	}

	.downapp>view:nth-child(3) {
		width: 80px;
	}

	.downapp>view:nth-child(2) {
		width: calc(100% - 125px);
	}

	.downapp button {
		display: inline-block;
		width: 70px;
		height: 28px;
		line-height: 28px;
		background-color: #FF4400;
		border-radius: 5px;
		color: #fff;
		font-size: 14px;
		vertical-align: middle;
		margin-left: 5px;


	}

	.getcode {
		position: absolute;
		right: 10px;
		top: 8px;
		height: 30px;
		line-height: 30px;
		display: inline-block;
		color: #666;
	}

	.passwordtips {
		width: calc(100% - 52px);
		padding-left: 52px;
		height: 16px;
		line-height: 16px;
		color: #666;
		text-align: left;
		display: block;
		font-size: 10px;
		margin-top: 5px;
	}

	.passwordtips>view {
		display: inline-block;
	}

	.passwordtips .color0 {
		color: #ff0000;
        font-size: 10px;
	}

	.passwordtips .color1 {
		color: #1834ab;
        font-size: 10px;
	}

	.passwordtips .color2 {
		color: #2FE30E;
        font-size: 10px;
	}

	.label-2-text {
		width: 40px;
		display: inline-block;
		text-align: center;
	}

	.icons {
		font-size: 26px !important;
		color: #1834AB !important;
		height: 23px;
		width: 23px;

	}

	.tip-icons {
		position: absolute;
		right: 5px;
		top: 11px;
		font-size: 22px !important;
		display: none;

	}

	.tip-icons.ok {
		color: #1D830D !important;
		display: inline-block;
	}

	.tip-icons.error {
		color: #e7202a !important;
		display: inline-block;
	}

	.tip-icons.active {
		color: #44d0ef !important;
	}

	.captchimg {
		position: absolute;
		right: 5px;
		;
		height: 40px;
		top: 1rpx;
		width: 80px;
		;
		/* border-radius: 5px;; */
	}

	.line {
		text-align: left;
		display: block;
		margin: 0 auto;
		width: calc(100% - 30px);
		height: 30px;
		line-height: 30px;
		margin-top: 20px;
		;
	}

	.uni-media-image {
		padding: 10upx 10upx;
		margin-top: 70upx;
		text-align: center;
	}

	.logo {

		height: 80px;
		border-radius: 10px;
	}

	.landing {
		height: 84upx;
		line-height: 84upx;
		color: #FFFFFF;
		font-size: 32upx;
		bordor: none;
		border-radius: 10upx;
	}

	.placeholdertext {
		/* #ifdef H5 */
		width: 40upx;
		/* #endif */

		/*#ifdef APP-PLUS */
		width: 40upx;
		/* #endif */

		height: 24upx;
	}

	.landing_true {}

	.landing_false {
		background-color: #d8d8d8;
	}

	.uni-button[type=primary] {}

	.login-btn {
		padding: 10upx 20upx;
		margin-top: 30upx;
		text-align: center;

	}

	.login-btn button {
		border-radius: 25px;
		background: -webkit-linear-gradient(left top, #44d0ef, #4399fe);
		background: -o-linear-gradient(bottom right, #44d0ef, #4399fe);
		background: -moz-linear-gradient(bottom right, #44d0ef, #4399fe);
		background: linear-gradient(to bottom right, #44d0ef, #4399fe);
	}

	.login-function {

		/* #ifdef H5 */
		margin-top: 350upx;
		/* #endif */

		/*#ifdef APP-PLUS */
		margin-top: 260upx;


		/* #endif */

		color: #999;
		text-align: center;
	}

	.login-function-old {
		margin-top: 60upx;
		margin-right: 30upx;
		color: red;
		text-align: center;
	}

	.login-forget {
		float: left;
		font-size: 26upx;
		color: #999;
	}

	.textspace {
		padding: 10upx 10upx;
	}

	.line1 {
		width: calc(100% - 100px);
		margin: 10px auto;
		display: block;
		height: 20px;
		line-height: 20px;
		text-align: center;
	}

	.line1 view {
		color: #666;
		float: text-align;
		font-size: 28upx;
		width: calc(50% - 1px);
		display: inline-block;
		border-right: 0px solid #666;
		height: 20px;
		line-height: 20px;
	}

	.line1 view:last-child {
		border-right: 0px;
		;
	}

	.login-register {
		color: #666;
		float: text-align;
		font-size: 26upx;
		width: 50%;
		display: inline-block;
	}

	.login-input input {
		/* background: #F2F5F6; */
		font-size: 28upx;
		padding: 10upx 25upx;
		height: 62upx;
		line-height: 62upx;
		border-radius: 8upx;
	}

	.login-margin-b {
		margin-bottom: 25upx;
	}

	.login-input {
		padding: 20upx 20upx;
	}

	.login-head {
		font-size: 34upx;
		text-align: center;
		height: 30upx;
	}

	.login-card {
		border-radius: 12upx;
        width: 92%;
        margin-left: 4%;
		/* padding: 10upx 25upx; */
		/* box-shadow: 0 6upx 18upx rgba(0,0,0,0.12); */
		position: relative;
		/* margin-top: 30px; */
	}

	.login-bg {
        padding-top:50px ;
		/* height: 260upx;
		padding: 25upx;
		background: linear-gradient(#FF978D, #FFBB69); */
	}



	.uni-input {

		font-size: 28upx;
		background: #0b0e37;
		flex: 1;
		width: calc(100vw - 100px);
		text-align: left;
        color: #fff;
        outline: none;
	}
    input{
        outline: none;
    }
    input:focus{
        background-color: wheat;
    }

	.uni-form-item .with-fun .uni-icon {
		text-align: left;
	}

	.modalhtml {
		position: fixed;
		z-index: 999;
		top: 0px;
		width: 100%;
		left: 0px;
		height: 100vh;
		background-color: rgba(0, 0, 0, 0.7);
	}

	.modalhtml .modal {
		background-color: #fff;
		border-radius: 10px;
		;
		top: 30vh;
		width: 80vw;
		left: 10vw;
		position: fixed;
		border: 1px #ddd solid;
	}

	.modalhtml .modal .title {
		text-align: center;
		height: 35px;
		line-height: 35px;
		color: #000;
		;
		font-size: 16px;
		;
		font-weight: 600;
		margin-top: 5px;
		;
	}

	.modalhtml .modal .content {
		padding: 5px 10px;
		max-height: 160px;
		;
		min-height: 65px;
		line-height: 30px;
		;
		overflow-y: scroll;
		font-size: 14px;
	}

	.modalhtml .modal .btns {
		text-align: center;
		height: 35px;
		line-height: 35px;
		color: #000;
		;
		font-size: 16px;
		;
		font-weight: 600;
		border-top: #eee 1px solid;
	}


	.notehtml {
		position: fixed;
		z-index: 999;
		top: 0px;
		width: 100%;
		left: 0px;
		height: 100vh;
		background-color: rgba(0, 0, 0, 0.7);
	}
</style>